{extend name="public/base" /}
{block name="head"}
	<link href="/static/umeditor/themes/default/css/umeditor.css" type="text/css" rel="stylesheet">
	<script type="text/javascript" src="/static/umeditor/third-party/jquery.min.js"></script>
	<script type="text/javascript" src="/static/umeditor/third-party/template.min.js"></script>
	<script type="text/javascript" charset="utf-8" src="/static/umeditor/umeditor.config.js"></script>
	<script type="text/javascript" charset="utf-8" src="/static/umeditor/umeditor.min.js"></script>
	<script type="text/javascript" src="/static/umeditor/lang/zh-cn/zh-cn.js"></script>

	<style type="text/css">
		form{width: 800px;}
	  .avatar-uploader .el-upload {border: 1px dashed #d9d9d9;border-radius: 6px;cursor: pointer;position: relative;overflow: hidden;}
	  .avatar-uploader .el-upload:hover {border-color: #20a0ff;}
	  .avatar-uploader-icon {font-size: 28px;color: #8c939d;width: 150px;height: 150px;line-height: 150px;text-align: center;}
	  .avatar{width: 150px;height: 150px;display: block;}
		.layui-form-selected{z-index: 9999;}
	</style>
{/block}
{block name="body"}
<div id="fuyun-app" class="fuyun-app">
  <div class="fuyun-title">
    <h5>添加数据</h5>
    <a href="{:Url('index')}" class="layui-btn fuyun-add-btn layui-btn-small layui-btn-normal"><i class="fa fa-plus-square margin-right-5"></i>返回</a>
  </div>
  <div class="content-box">

		<form class="layui-form padding-10" method="post" action="{:Url('create')}">
			<div class="left-box">
				<div class="layui-form-item">
					<label class="layui-form-label">配置类型</label>
					<div class="layui-input-inline">
						<select name="config_type" lay-filter="configType">
							<option value="text">text</option>
							<option value="image">image</option>
							<option value="editor">editor</option>
						</select>
					</div>
				</div>
				
				<div class="layui-form-item">
					<label class="layui-form-label">标识</label>
					<div class="layui-input-inline">
						<input type="text" name="config_key" placeholder="请输入密码" class="layui-input" >
					</div>
				</div>

	
				<div class="layui-form-item" v-show="config_type == 'text'">
					<label class="layui-form-label">文本</label>
					<div class="layui-input-block">
						<textarea name="text" placeholder="请输入文本" class="layui-textarea"></textarea>
					</div>
				</div>

		    <div class="layui-form-item" v-show="config_type == 'image'">
					<label class="layui-form-label">上传图片</label>
					<el-upload
					  class="avatar-uploader"
					  action="{:Url('/admin/upfile/uploadimage')}"
					  :show-file-list="false"
					  :on-success="handleAvatarSuccess"
					  :before-upload="beforeAvatarUpload">
					  <img v-if="imageUrl" :src="imageUrl" class="avatar">
					  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
					</el-upload>

					<input type="hidden" name="image" :value="imageUrl">
		    </div>

		    <div class="layui-form-item" v-show="config_type == 'editor'">
		    	<label class="layui-form-label">文本</label>
		    	<div class="layui-input-block">
						<script type="text/plain" id="editor" name="editor" style="height:260px;width:600px;"></script>
					</div>
		    </div>

				<div class="layui-form-item">
					<label class="layui-form-label">备注</label>
					<div class="layui-input-inline">
						<textarea name="remark" placeholder="请输入备注" class="layui-textarea"></textarea>
					</div>
				</div>


				<div class="layui-form-item">
					<div class="layui-input-block">
						<button class="layui-btn" lay-submit lay-filter="ajaxForm">立即提交</button>
						<button type="reset" class="layui-btn layui-btn-primary">重置</button>
					</div>
				</div>
			</div>
		</form>
	</div>
</div>

<script type="text/javascript">

	var Main = new Vue({
		el:"#fuyun-app",
		data:{
			config_type: 'text',
			imageUrl:'',
		},
		created: function(){
			// alert();
		},
		methods:{
			changeConfigType: function(configType){
				alert(configType);
			},
      handleAvatarSuccess(res, file) {
        this.imageUrl = res.url;
      },
      beforeAvatarUpload(file) {
      	return true;
      }
		}
	});


	layui.use(['form','layer'], function(){
  	var form = layui.form();

		form.on('select(configType)', function(data){
			Main.config_type = data.value;
		});

		form.on('submit(ajaxForm)', function(data){
			var that = this;
			// $(that).attr("disabled","disabled");
			$.ajax({ 
				type: "post", 
				url: data.form.action, 
				data: data.field,
				dataType: 'json', 
				success: function(result){ 
					if(result['code'] == 1){
						layer.msg(result['msg']);
						window.setTimeout(function(){
							window.location.href = document.referrer;
						},800);
						
					}else{
						layer.msg(result['msg']);
						$(that).removeAttr("disabled");
					}
				} 
			});
			return false;
		});
	})

</script>
<!--编辑器-->
<script type="text/javascript">
    var um = UM.getEditor('editor');
</script>
{/block}



		